<table class="table table-striped table-hover table-bordered" id="sample_editable_1">
	<thead>
		<tr>
			<th>编号</th>
			<th>缩略图</th>
			<th>图片描述</th>
			<th>排序</th>
			<th>操作</th>
		</tr>
	</thead>
	<tbody>
		<tr class="odd gradeX" th:each="data : ${albums}">
			<td th:text="${data.id}"></td>
			<td width="10px">
			<img id="thumbGoodsPic_display" style="width: 50px; height: 50px;" th:src="${data.picAddress}" />
			</td>
			<td th:text="${data.picDescription}" class="caname"></td>
			<td  th:text="${data.picSort}" class="caname"></td>
			<td><a href="#" th:href="${data.id}+'_'" th:attr="id=${'link_delete_'+dataStat.index},name=${'link_delete_'+dataStat.index}" onclick="del(event,this);"><i class="fa fa-minus"></i>移除</a></td>
		</tr>
	</tbody>
</table>
<script th:inline="javascript">
/*<![CDATA[*/
  $(function() { 
//给页面中有caname类的标签上加上click函数 
$(".caname").click(function() { 
	var objTD = $(this); 
	
//先将老的类别名称保存起来,并用trim方法去掉左右多余的空格 
	var oldText = $.trim(objTD.text()); 

	var hidden_goodId = document.getElementById("hidden_goodId").value;


//构造一个input的标签对象（作用是为了让这个input失效，不然点击多次后，文字会消失） 
	var input = $("<input type='text' value='" + oldText + "' />"); 

//当前td的内容变为文本框，并且把老类别名放进去 
	objTD.html(input); 

//设置文本框的点击事件失效 
	input.click(function() { 
	return false; 
}); 

//设置文本框样式，让界面显示的人性化点 
input.css("font-size", "16px"); 
input.css("text-align", "center"); 
input.css("background-color", "#F7F2DE"); 
input.width("120px"); 

//自动选中文本框中的文字 
	input.select(); 

//文本框失去焦点时重新变为文本 
	input.blur(function() { 

//获得新输入的类别名 
	var newText = $(this).val(); 
	
	

	var previd = objTD.prev().prev().prev().text();
	if(previd == ""){
		if(newText == ""){
			window.location.reload();
//				$('#div_album_grid');
		}else{
			//图片描述
			var caId = objTD.prev().prev().text();
			var diff = "picDer";
			var statusline ="statusline";
			var checkText =/^[a-zA-Z|\d|\u0391-\uFFE5]*$/;
			var x = checkText.test(newText);
			if(!x){
				alert("请您输入汉字，数字或者英文字母！")
			}else{
				BOSS.remoteCall('goods/goods/saveLine/'+caId+'/'+newText+'/'+hidden_goodId+'/'+diff,$('#div_album_grid'),{statusline:statusline});
			}
		}
		
			
	}else{
		//排序
		var exp=/^(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-4])$/;
		var x=exp.test(newText);
		if(!x){
			alert("请输入0-255范围的正整数！");
		}else{

			//用新的类别名文字替换之前变过来的输入框状态 
				objTD.html(newText); 
			//获取该类别名所对应的ID(caId) 
				var caId = objTD.prev().prev().prev().text();
			//将新的类别名进行转码，不然界面以及数据库显示的都是"???"这样的乱码 
				newText = escape(newText); 
			//获取要传到"一般处理文件"(ChangeCaName.ashx)中的URL 
				//var url = "/goods/goods/saveLine?caid=" + caId + "&caname=" + newText;
			//AJAX异步更改数据库,data为成功后的回调返回值，用于显示提示信息 
				//$.get(url, function(data) { alert(data) });
				
				var diff = "picSort";
				var statusline ="statusline";
				BOSS.remoteCall('goods/goods/saveLine/'+caId+'/'+newText+'/'+hidden_goodId+'/'+diff,$('#div_album_grid'),{statusline:statusline});
		}
	}


}); 
}); 
}); 


  function del(event,element,data){
  	event.preventDefault();
    	bootbox.confirm("您确定删除吗?", function(result) {
  	if(result){
  		var _id = $(element).attr("href").split("_")[0];
  		var _goodId = document.getElementById("hidden_goodId").value;
  		BOSS.remoteCall('goods/album/delete',$('#div_album_grid'),{id:_id,goodId:_goodId});
  		}
  	}); 
  }
	
	$(document).ready(function(){
		var oTable = $('#sample_editable_1').dataTable({
        	'bPaginate':false,
        	 'bSort':true,
        	 "aoColumnDefs": [{
                 'bSortable': false,
                 'aTargets': [1,2,4]
             }
         ],
		
                'bSortClasses':false,
                'bInfo':false,
                'oLanguage': {
                    'sEmptyTable': '没有图片，请您添加'
                },
                'searching':false,
                'bFilter':false,
                "bRetrieve": true
        });
	    });
/*]]>*/
</script>